
div.gridview { padding-left: 50px; }
/*
div.section { background-color: cyan; margin-left: -10px; }
div.section.closed table { display: none; }
div.section.closed div.section { display: none; }
div.section div.section { background-color: magenta; margin-left: 10px; }
div.section:nth-child(odd) { background-color: green; }
div.section div.section:nth-child(odd) { background-color: gray; }

div.gridview > div.section > table {  margin-left: 10px; }
*/
table {
  border-collapse: collapse;
}

td ,th {
  /*width: 30px;*/
/*  border: 1px solid black; */
  border-right-style: solid;
  border-right-width: 1px;

  margin: 0;
}
td span { width: 30px; display: block; overflow:hidden; }

td.filler { border: none; background-color: white; }
td.extenser {
  margin: 0; border: 1px solid white; padding: 0;
  width: 4px;
  background-color: black;
}

tr {
  background-color: white;
  margin: 0;
  /* emulate this in js for 'old' browser :) */
  -webkit-transition: background-color 250ms ease-out;
      /* 400ms cubic-bezier(0.25, 0.1, 0.25, 1.0); */
      /* 150 ms linear; */
}
tr.odd { background-color: yellow; }
tr:hover { background-color: #CFF; } /* below odd for higher priority */
tr.hide { display: none; }  /* below odd and hover for higher priority */
tr.section { background-color: #DDD; }
tr.section:hover { background-color: #BBB; }

/* Grip */
div.gripwrapper { position:relative; height:100%; width:100%; }
div.hgrip {
  position:absolute;
  height:100%;
  width:5px;
  margin-right:-5px;
  left:100%;
  top:0px;
  cursor:w-resize;
  z-index:10;

  background-color: black;
}

